const _flags_items = [
  {
    type: "category",
    label: "Text Element Flags",
    collapsed: false,
    items: [
      {
        type: "doc",
        id: "@designto-code/flags/--as-h1",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-h2",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-h3",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-h4",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-h5",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-h6",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--as-p",
      },
    ],
  },
  {
    type: "category",
    label: "Sizing Flags",
    collapsed: false,
    items: [
      {
        type: "doc",
        id: "@designto-code/flags/--width",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--height",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--min-width",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--min-height",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--max-width",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--max-height",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--fix-width",
      },
      {
        type: "doc",
        id: "@designto-code/flags/--fix-height",
      },
    ],
  },
  {
    type: "doc",
    id: "@designto-code/flags/--artwork",
  },
  {
    type: "doc",
    id: "@designto-code/flags/--as-wrap",
  },
];

const together = [
  {
    type: "autogenerated",
    dirName: "together",
  },
  {
    type: "link",
    href: "https://github.com/gridaco/grida/issues/new",
    label: "Feature Requests",
  },
  {
    type: "link",
    label: "Chat with us on Slack",
    href: "https://grida.co/join-slack",
  },
];

const api = [
  {
    type: "autogenerated",
    dirName: "reference",
  },
  {
    type: "category",
    label: "Design to Code Blueprints",
    items: [
      "component-multi-proxied-property",
      "component-nested",
      "component-property-default-value",
      "component-property-interfacing-auto",
      //
      "css-box-sizing",
      "css-clip-path",
      "css-color-vs-background-color",
      "css-mask",
      "css-position-absolute-vs-fixed",
      //
      "figma-autolayout",
      "figma-blur-effects",
      "figma-boolean-operation",
      "figma-box-shadow",
      "figma-constraint-center",
      "figma-constraint-scale",
      "figma-constraint-stretch",
      "figma-gradient",
      "figma-line-height",
      "figma-line",
      "figma-mask-layer",
      "figma-rotation",
      "figma-scale",
      "figma-strokes",
      "figma-text-autoresize",
      "figma-text-shadow",
      "figma-vector",
      "figma-visibility",
      //
      "flutter-box-decoration-multiple-visuals",
      "flutter-multiple-gradients",
      "flutter-positioned-vs-align",
      "flutter-svg-support",
      "flutter-when-to-use-constrainedbox",
      //
      "icons",
      "item-order",
      "item-overflow",
      "item-spacing",
      "overflow-layout-scroll",
      //
      "react-jsx-css-line-break",
    ].map((d) => ({
      type: "doc",
      id: `@designto-code/${d}`,
    })),
  },
  {
    type: "category",
    label: "Flags Reference",
    items: _flags_items,
  },
  // {
  //   type: "category",
  //   label: "Conventions",
  //   items: [
  //     {
  //       type: "autogenerated",
  //       dirName: "conventions",
  //     },
  //   ],
  // },
];

const flags = [
  {
    type: "autogenerated",
    dirName: "flags",
  },
  ..._flags_items,
];

const docs = [
  {
    type: "doc",
    id: "intro",
  },
  {
    type: "category",
    label: "Getting Started",
    collapsed: false,
    items: [
      {
        type: "autogenerated",
        dirName: "getting-started",
      },
    ],
  },
  {
    type: "category",
    label: "Concepts",
    collapsed: false,
    items: [
      {
        type: "autogenerated",
        dirName: "concepts",
      },
    ],
  },
  {
    type: "category",
    label: "Assistant",
    items: [
      {
        type: "autogenerated",
        dirName: "assistant",
      },
    ],
  },
];

const wg = [
  {
    type: "autogenerated",
    dirName: "wg",
  },
];

/**
 * Creating a sidebar enables you to:
 - create an ordered group of docs
 - render a sidebar for each doc of that group
 - provide next/previous navigation

 The sidebars can be generated from the filesystem, or explicitly defined here.

 Create as many sidebars as you want.
 */

// @ts-check
/** @type {import('@docusaurus/plugin-content-docs').SidebarsConfig} */
const sidebars = {
  tutorialSidebar: docs,
  flagsSidebar: flags,
  togetherSidebar: together,
  apiSidebar: api,
  wgSidebar: wg,
};

module.exports = sidebars;
